<template>
    <div id="app">
        <common-nav-header v-if="showHeader"></common-nav-header>
        <router-view class="my-view" />
        <common-nav-footer v-if="showFooter"></common-nav-footer>
    </div>
</template>

<script>
    // 引入公用的头部导航
    import CommonNavHeader from '@/components/commonHeader/CommonNavHeader';

    // 引入公用的底部导航
    import CommonNavFooter from '@/components/commonFooter/CommonNavFooter';

    export default {
        name: 'app',
        created() {},
        data() {
            return {
                showHeader: false,
                showFooter: false
            };
        },
        methods: {},
        watch: {
            '$route'(to, from) {
                /* 这里将与登录相关的不需要头底公用部分排除掉 */
                if (to.path == '/user/loginentry' || to.path == '/user/accountlogin') {
                    this.showHeader = false;
                    this.showFooter = false;
                } else {
                    this.showHeader = true;
                    this.showFooter = true;
                }

                /* 这里将实名认证去除底部公用模块 */
                if (to.path == '/auth/realnameauthpage' || to.path == '/shop/detail') {
                    this.showFooter = false;
                } else {
                    this.showFooter = true;
                }
            }
        },
        components: {
            CommonNavHeader,
            CommonNavFooter
        }
    };

</script>

<style lang="scss">
    #app {
        height: 100%;

        .my-view {
            padding: 88px 0 98px 0;
        }
    }

</style>
